<template>
	<view  class="padding-top">
		<cu-custom bgColor="bg-top" :isBack="true">
			<block slot="content">{{name}}</block>
		</cu-custom>
		<!-- <view v-for="(item,key) in polls" :key="key">
			<navigator :url="'pollValue?mn=' + mn + '&polls=' + item.pollCode + '&pollName=' + item.pollName+ '&pollUnit=' + item.pollUnit" >
				<view class="hm-downloads-card cu-card case">
				  <view class="container cu-item shadow">
				    <view class="downloadDetail">
				      <view class="downloadDetail-container">
				        <text class="count">{{ item.pollName }}</text>
				        <text class="downloads">{{ item.pollUnit }}</text>
				      </view>
				    </view>
				    <image class="downloadImage" src="/static/hm-downloads-card/images/img_24402_0_0.png" />
				  </view>
				</view>
			</navigator>
		</view> -->
		<form class="" @submit="formSubmit">
			<view class="card-menu cu-list menu">
				<view class="cu-item ">
					<view class="content">
						<text class="text-orange cuIcon-roundrightfill"></text>站点监测污染物
					</view>
				</view>
			</view>
			<view class="card-menu cu-list menu" >
				<view class="cu-item arrow" v-for="(item,key) in polls" :key="key">
					<navigator :url="'pollValue?mn=' + mn + '&polls=' + item.pollCode + '&pollName=' + item.pollName+ '&pollUnit=' + item.pollUnit">
						<view class="content padding-tb-sm">
							{{item.pollName}}
							<view class="text-gray ">
								 {{item.pollUnit}}
							</view>
						</view>
					</navigator>
				</view>
			</view>
			
		</form>
	</view>
</template>

<script>
	import Util from '@/utils/util.js'
	export default {
		components: {
		},
		data() {
			return {
				TabCur: 0,
				name:'',
				mn:'',
				polls:[],
			};
		},
		onLoad(e) {
			//加载站点污染物
			if(e.mn){
				this.mn = e.mn
			}
			if(e.name){
				this.name = e.name
			}
			if(e.siteId){
				Util.request('/monitor/EquipmentPollution/list', {siteID:e.siteId}, 'GET').then(res=>{
					this.polls = res.data
				}).catch(()=>{
					//联网失败, 结束加载
				})
			}
		},
		methods:{
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
			},
		}
	}
</script>

<style lang="scss">
	/*样式的width和height一定要与定义的cWidth和cHeight相对应*/
	.qiun-charts {
		width: 750upx;
		height: 500upx;
		background-color: #11CC99;
	}
	
	.qiun-columns {
		display: flex;
		flex-direction: column !important;
	}
	
	.charts {
		width: 750upx;
		height: 500upx;
		background-color: #11CC99;
	}
	
	.scroll{
		height: 700rpx;
	}
	
	.hm-downloads-card {
	  display: flex;
	  align-items: center;
	  flex-direction: row;
	  justify-content: center;
	  width: 100%;
	  height: 242.21rpx;
	}
	
	.container {
	  box-sizing: border-box;
	  display: flex;
	  align-items: center;
	  flex-direction: row;
	  justify-content: space-between;
	  border-radius: 38.96rpx;
	  padding-right: 56.49rpx;
	  padding-left: 62.34rpx;
	  box-shadow: 0px 10px 30px rgba(209, 213, 223, 0.5);
	  background-color: #00c600;
	  width: 720.78rpx;
	  height: 214.29rpx;
	}
	
	.downloadDetail {
	  display: flex;
	  flex-direction: row;
	}
	
	.downloadDetail-container {
	  display: flex;
	  align-items: flex-start;
	  flex-direction: column;
	  height: 89.61rpx;
	}
	
	.count {
	  opacity: 1;
	  line-height: 46.75rpx;
	  white-space: nowrap;
	  color: #ffffff;
	  font-family: Helvetica;
	  font-size: 31.17rpx;
	  font-weight: normal;
	}
	
	.downloads {
	  opacity: 1;
	  margin-top: 1.95rpx;
	  line-height: 40.91rpx;
	  white-space: nowrap;
	  color: #ffffff;
	  font-family: Helvetica;
	  font-size: 27.27rpx;
	  font-weight: normal;
	}
	
	.downloadImage {
	  width: 272.73rpx;
	  height: 97.4rpx;
	}
	
</style>
